import {Search} from '@/components';
import {Box, Flex, Image, ScrollView, Text} from 'native-base';
import React from 'react';
import {SafeAreaView} from 'react-native-safe-area-context';
import SvgIcons from '@/assets/svg';

const Education = () => {
  const renderList = () => {
    const list = [
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '生命的价值和意义',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '职业和能力',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '工作和岗位',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '企业和个人',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '生产和消费',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '行业和市场',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '财富和金融',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '教育知识库',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '科学技术和知识',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '生活常识',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '学科和专业',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '学校和机构',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '图书和档案',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '产业经济',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '人文社会',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '文化历史',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '军事政治',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '宇宙世界',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '自然环境',
      },
      {
        icon: 'https://alifei01.cfp.cn/creative/vcg/800/new/VCG211458444488.jpg',
        title: '国家地理',
      },
    ];
    return (
      <Box pb="10">
        {list.map((item, index) => {
          return (
            <Box
              flexDir="row"
              borderBottomColor="gray.300"
              borderBottomWidth={index === list.length - 1 ? 0 : 1}
              py="4"
              mx="4"
              key={item.title}
              justifyItems="center"
              justifyContent="center"
              alignItems="center">
              <Flex flex={1} flexDir="row" alignItems="center">
                <Image source={{uri: item.icon}} alt="图片" size="10" />
                <Text fontSize="md" pl="3">
                  {item.title}
                </Text>
              </Flex>
              <SvgIcons.ChevronLeftIcon style={{transform: [{rotate: '180deg'}]}} width={24} height={24} color="#52525b" />
            </Box>
          );
        })}
      </Box>
    );
  };
  return (
    <SafeAreaView style={{flex: 1}} edges={['top', 'left', 'right']}>
      <Box w="full" h="full">
        <Search />
        <ScrollView showsVerticalScrollIndicator={false} bounces={false}>
          {renderList()}
        </ScrollView>
      </Box>
    </SafeAreaView>
  );
};

export default Education;
